import 'package:flutter/material.dart';
import 'package:flutter_taotaoshipin/common/theme/app_colors.dart';
import 'package:flutter_taotaoshipin/model/drama_ranking_entity.dart';
import 'package:flutter_taotaoshipin/pages/drama/drama_routes.dart';
import 'package:flutter_taotaoshipin/widget/gaps.dart';
import 'package:flutter_taotaoshipin/widget/load_image.dart';
import 'package:get/get.dart';

class DramaRankItem extends StatefulWidget {
  const DramaRankItem({
    super.key,
    required this.model,
    required this.rank,
    this.onTap,
  });

  final DramaRankingEntity model;
  final int rank;
  final Function()? onTap;

  @override
  State<DramaRankItem> createState() => _DramaRankItemState();
}

class _DramaRankItemState extends State<DramaRankItem> {
  @override
  Widget build(BuildContext context) {
    return Container(
      width: double.infinity,
      height: 130,
      padding: const EdgeInsets.symmetric(vertical: 10),
      decoration: BoxDecoration(
        border: Border(bottom: Divider.createBorderSide(context)),
      ),
      child: Row(
        children: [
          Stack(
            children: [
              ClipRRect(
                borderRadius: BorderRadius.circular(10),
                child: AspectRatio(
                  aspectRatio: 0.75,
                  child: LoadImage(widget.model.img!),
                ),
              ),
              Positioned(
                left: 5,
                top: -3,
                child: Stack(
                  alignment: Alignment.center,
                  children: [
                    const Icon(
                      Icons.bookmark_sharp,
                      color: AppColors.app_main,
                    ),
                    Text(
                      widget.rank.toString(),
                      style: const TextStyle(
                        color: Colors.white,
                        fontSize: 12,
                      ),
                    ),
                  ],
                ),
              ),
            ],
          ),
          Gaps.hGap15,
          Expanded(
            child: Column(
              mainAxisAlignment: MainAxisAlignment.spaceBetween,
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                Text(widget.model.dramaName!),
                Text(
                  widget.model.desc!,
                  style: TextStyle(fontSize: 12, color: Colors.grey),
                  maxLines: 2,
                  overflow: TextOverflow.ellipsis,
                ),
                Row(
                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                  children: [
                    Text('全${widget.model.allEp!}集'),
                    ElevatedButton(
                      onPressed: () {
                        if (widget.onTap != null) {
                          widget.onTap!.call();
                        } else {
                          // 跳转视频详情页
                          Get.toNamed(DramaRoutes.detail,
                              arguments: {
                                'id': widget.model.dramaId,
                                'title': widget.model.dramaName,
                              });
                        }
                      },
                      style: ButtonStyle(
                        shape: MaterialStateProperty.all(
                          RoundedRectangleBorder(
                            borderRadius: BorderRadius.circular(30),
                          ),
                        ),
                      ),
                      child: const Text('立即观看'),
                    ),
                  ],
                ),
              ],
            ),
          ),
        ],
      ),
    );
  }
}
